<template>
	<view>
		<view class="box">
			<view class="house-news mes">
				房屋信息
			</view>
			<view class="house-location">
				北京西三旗花园1号楼 101
			</view>
			<view class="person-news mes">
				报修信息
			</view>
			<u-form :model="form">
				<u-form-item label="维修项目" labelWidth="208rpx">
					<input type="text" :value="form.name" placeholder="请选择" />
				</u-form-item>
				<u-form-item label="手机号码" labelWidth="208rpx">
					<input type="text" :value="form.mobile" placeholder="请输入联系电话号码" />
				</u-form-item>
				<u-form-item label="预约日期" labelWidth="208rpx">
					<input type="text" :value="form.date" placeholder="请选择上门维修日期" />
				</u-form-item>
				<u-form-item label="问题描述" labelWidth="208rpx" labelPosition="top">
					<textarea placeholder="请填写详细报修内容，有助于工作人员快速帮您解决问题。" auto-focus :value="form.question"></textarea>
				</u-form-item>
				<u-form-item label="问题附件" labelWidth="208rpx" labelPosition="top">
					<view class="question-file">

					</view>
				</u-form-item>
			</u-form>
		</view>
		<!-- 提交报修 -->
		<life-button icon="../../static/icon/repair.png">提交报修</life-button>
	</view>
</template>

<script>
	import qqmapwx from '@/utils/initQqMapWx.js'
	export default {
		data() {
			return {
				location: {
					longitude: 0,
					latitude: 0
				},
				markers: [{
					id: 1,
					longitude: 0,
					latitude: 0
				}],
				currentLocation: '定位中',
				form: {
					name: null,
					mobile: null,
					date: null,
					question: null
				}
			};
		},
		onLoad() {},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.map map {
		width: 750rpx;
		height: 440rpx;
	}

	.mes {
		color: #979797;
		font-weight: regular;
		font-size: 24rpx;
		padding: 30rpx 0 20rpx 30rpx;
		line-height: 1.5;
		background-color: #FAFAFA;
	}

	.box {
		padding-bottom: 279rpx;
		background-color: #FAFAFA;

		.house-location {
			background-color: #fff;
			padding: 30rpx 0 30rpx 30rpx;
			font-size: 28rpx
		}

		::v-deep .u-form {
			background-color: #fff;
		}

		::v-deep .u-count-down__text {
			color: #5591AF;
		}

		::v-deep .u-form-item__body {
			margin-left: 30rpx;
			padding: 30rpx 30rpx 30rpx 0;
			// padding-right: 30rpx;
			border-bottom: 1px solid #F2F2F6;
		}

		textarea {
			margin-top: 20rpx;
			width: 100%;
			height: 200rpx !important;
		}

		.question-file {
			padding-top: 20rpx;

			image {
				width: 50rpx;
			}
		}
	}
</style>
